<!DOCTYPE html>
<html class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="/static/css/font.css">
    <link rel="stylesheet" href="/static/css/xadmin.css">
    <link rel="stylesheet" href="/static/lib/layui/css/layui.css">
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        /*
        KISSY CSS Reset
        理念：1. reset 的目的不是清除浏览器的默认样式，这仅是部分工作。清除和重置是紧密不可分的。
        2. reset 的目的不是让默认样式在所有浏览器下一致，而是减少默认样式有可能带来的问题。
        3. reset 期望提供一套普适通用的基础样式。但没有银弹，推荐根据具体需求，裁剪和修改后再使用。
        特色：1. 适应中文；2. 基于最新主流浏览器。
        维护：玉伯<lifesinger@gmail.com>, 正淳<ragecarrier@gmail.com>
         */

        /** 清除内外边距 **/
        body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
        dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
        pre, /* text formatting elements 文本格式元素 */
        form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
        th, td /* table elements 表格元素 */
        {
            margin: 0;
            padding: 0;
        }

        /** 设置默认字体 **/
        body,
        button, input, select, textarea /* for ie */
        {
            font: 12px/1.5 tahoma, arial, \5b8b\4f53, sans-serif;
        }

        h1, h2, h3, h4, h5, h6 {
            font-size: 100%;
        }
    </style>
</head>
<body>
    <div>
        <div class="layui-container">
            <br>
            <div class="layui-row">
                <a class="layui-btn" th:href="@{/fees/add}" target="_self">添加收费模板</a>
            </div>
            <div class="layui-row">
                <table class="layui-table">
                    <thead>
                        <tr>
                            <th>编号</th>
                            <th>名称</th>
                            <th>说明</th>
                            <th>单价</th>
                            <th>周期</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr th:each="fees,state:${feesList}">
                            <td th:text="${fees.id}"></td>
                            <td th:text="${fees.name}"></td>
                            <td th:text="${fees.remark}"></td>
                            <td th:text="${fees.price}"></td>
                            <td th:text="${fees.number}"></td>
                            <td>
                                <a th:href="@{'/fees/delete?id='+${fees.id}}">删除</a>
                                <a th:href="@{'/fees/edit?id='+${fees.id}}">修改</a></td>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="layui-row">
                <div id="page" align="center"></div>
            </div>
        </div>
        <script type="application/javascript" src="/static/lib/layui/layui.js"></script>
    </div>
<script>
    layui.use(['jquery','laypage'], function () {
        var $ = layui.jquery
            ,laypage = layui.laypage;

        //渲染
        laypage.render({
            elem: 'page'
            ,count:20
        });
    });
</script>
</body>
</html>
